<ul class="breadcrumb">
	<li><span class="primary-font"><i class="fa fa-home"></i></span><a href="javascript:;" class="itemHasChild" refTpl="html/pcsuccess/main.tpl" refJs="js/pcsuccess/main.js" ty="1"> 主页</a></li>
	<li>公众号管理</li>	 
	<li>自定义菜单</li>	
</ul>

<div class="smart-widget">
	<div class="smart-widget-header">
		
		<div class="search-input">
			<button id="addWechatMenu" class="btn btn-success marginTB-xs">新增菜单</button>
		</div>
		<span class="smart-widget-option">
			<a href="#" class="widget-refresh-option" id="refreshDiv">
                <i class="fa fa-refresh"></i>
            </a>
        </span>
	</div>
	<div class="smart-widget-inner">
		<div class="smart-widget-hidden-section">
			<ul class="widget-color-list clearfix">
				<li style="background-color:#20232b;" data-color="widget-dark"></li>
				<li style="background-color:#4c5f70;" data-color="widget-dark-blue"></li>
				<li style="background-color:#23b7e5;" data-color="widget-blue"></li>
				<li style="background-color:#2baab1;" data-color="widget-green"></li>
				<li style="background-color:#edbc6c;" data-color="widget-yellow"></li>
				<li style="background-color:#fbc852;" data-color="widget-orange"></li>
				<li style="background-color:#e36159;" data-color="widget-red"></li>
				<li style="background-color:#7266ba;" data-color="widget-purple"></li>
				<li style="background-color:#f5f5f5;" data-color="widget-light-grey"></li>
				<li style="background-color:#fff;" data-color="reset"></li>
			</ul>
		</div>
		<div class="smart-widget-body">
			<table class="table table-striped" id="messageTable">
	      		
		    </table>
		</div>
	</div>
</div>

<div class="modal fade bs-example-modal-lg" tabindex="-1" id="addWechatMenuModal" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true" data-backdrop="static" data-keyboard="false" style="display: none;">
    <div class="modal-dialog modal-lg" style="width:70%;">
        <div class="modal-content" >
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true" id="closeBtn">×</button>
                <h4 class="modal-title">自定义菜单</h4>
            </div>
            <div class="modal-body" style="height:650px;">
				<div class="row-fluid sortable">
					<div class="box span12">
						<div class="box-header" data-original-title>
							<div class="box-icon">
								<a href="#" class="btn-minimize"><i class="halflings-icon chevron-up"></i></a>
							</div>
						</div>
						<div id="roleListDiv" class="box-content contentDiv">
							<div class="cd-iphone-6 cd-rosegold cd-scale-100" style="height: 51em;" >
								<div class="cd-body" style="height:47em;">
									<div class="cd-sound"></div>
									<div class="cd-sleep"></div>
									<div class="cd-camera"></div>
									<div class="cd-ear"></div>
									<div class="cd-home"></div>
									<div class="cd-screen" style="background: url('../../assets/images/abg.png');background-size: 100% 100%;background-position: center;background-repeat: no-repeat;height: 470px;">
										<div id="menuNameDiv" class="btn3 clearfix">
											
										</div>
									</div>
								</div>
							</div>
							
							<div style="width:100%;">
								<div style="margin:0px 0px 10px 320px;">
									<span class="add-on">菜单名称：</span> <input type="text"
										class="span6 typeahead form-control" id="menuName" menuId="0" level="0" />
								</div>
								<ul id="myTab" class="nav nav-tabs margin-left-400" style="float:right;">
									<li class="active"><a href="#home" data-toggle="tab">发送消息</a></li>
									<li class=""><a href="#ios" data-toggle="tab">跳转网页</a></li>
								</ul>
								<div id="myTabContent" class="tab-content phone-First-Tab" style="margin:0px 0px 0px 320px;">
									<div class="tab-pane fade in active" id="home">
										<ul id="Tw" class="nav nav-tabs margin-Top-Left-30">
											<li class="active"><a href="#tab1" data-toggle="tab">图文消息</a></li>
											<li class=""><a href="#tab2" data-toggle="tab">图片</a></li>
											<li class=""><a href="#tab3" data-toggle="tab">语音</a></li>
											<li class=""><a href="#tab4" data-toggle="tab">视频</a></li>
											<li class=""><a href="#tab5" data-toggle="tab">文字</a></li>
										</ul>
										<div id="context" class="tab-content margin-Top-Left-30">
											<div class="tab-pane fade in active" id="tab1" >
												图文消息测试
											</div>
											<div class="tab-pane fade" id="tab2">
												图片测试
											</div>
											<div class="tab-pane fade" id="tab3">
												语音测试
											</div>
											<div class="tab-pane fade" id="tab4">
												视频测试
											</div>
											<div class="tab-pane fade" id="tab5">
												<span class="add-on">回复内容：</span>
												<textarea class="span6 typeahead form-control callBackDesc" id="rebackContext" rows="12"></textarea>
												<div >
													<p class="rolePrompt">点击该按钮时，微信公众号会回复这些文字</p>
												</div>
											</div>
										</div>
									</div>
									<div id="ios" class="tab-pane fade margin-Top-Left-30">
										<span class="add-on">跳转链接：</span>
										<input type="text" class="span6 typeahead form-control" id="linkNet" />
										<div class="someDesc">
											<p class="rolePrompt">点击该按钮时，会跳转到该链接的页面</p>
										</div>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
			<div class="modal-footer" style="display: none;" id="footerModal">
				<div class="form-group">
					<div class="col-sm-offset-2 col-sm-10">
						<button type="submit" id="saveBean" class="btn btn-palegreen">保存</button>
						<button type="button" id="deleteBean" class="btn btn-primary">删除</button>
					</div>
				</div>
			</div>
        </div>
    </div>
</div>

<div class="modal fade bs-example-modal-lg" tabindex="-1" id="queryWechatMenuModal" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true" data-backdrop="static" data-keyboard="false" style="display: none;">
    <div class="modal-dialog modal-lg" style="width:50%;">
        <div class="modal-content" >
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true" id="closeBtn">×</button>
                <h4 class="modal-title">菜单详情</h4>
            </div>
            <div class="modal-body" style="height:650px;">
				<div class="row-fluid sortable">
					<div class="box span12">
						<div class="box-header" data-original-title>
							<div class="box-icon">
								<a href="#" class="btn-minimize"><i class="halflings-icon chevron-up"></i></a>
							</div>
						</div>
						<div id="roleListDiv" class="box-content contentDiv" style="margin:0 auto;">
							<div class="cd-iphone-6 cd-rosegold cd-scale-100" style="height:51em;position: absolute;left: 0;bottom: 0;top: 50px;right: 0;margin: auto;">
								<div class="cd-body" style="height:47em;">
									<div class="cd-sound"></div>
									<div class="cd-sleep"></div>
									<div class="cd-camera"></div>
									<div class="cd-ear"></div>
									<div class="cd-home"></div>
									<div class="cd-screen" style="background: url('../../assets/images/abg.png');background-size: 100% 100%;background-position: center;background-repeat: no-repeat;height: 470px;">
										<div id="menuNameInfoDiv" class="btn3 clearfix">
											
										</div>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
        </div>
    </div>
</div>


<script id="menuListBean" type="text/x-handlebars-template"> 
	{{#each rows}}
		<div class="menu">
			<div class="bt-name" rowId="{{id}}">{{menuName}}</div>
			<div class="sanjiao"></div>
			<div class="new-sub">
				<ul>
					{{#each beanItems}}
						<li class="rowMenu" rowId="{{id}}"><a href="javascript:;">{{menuName}}</a></li>
					{{/each}}
				</ul>
				<div class="tiggle"></div>
				<div class="innertiggle"></div>
			</div>
		</div>
	{{/each}}
</script>

